// 白色背景修复样式 - 强制覆盖所有白色背景元素

// 强制覆盖所有可能的白色背景
* {
  &[style*="background-color: white"],
  &[style*="background-color: #fff"],
  &[style*="background-color: #ffffff"],
  &[style*="background: white"],
  &[style*="background: #fff"],
  &[style*="background: #ffffff"] {
    background-color: #2c3d55 !important;
    background: #2c3d55 !important;
    color: #ffffff !important;
  }
}

// 强制覆盖所有白色背景的类
.white-bg,
.bg-white,
.background-white,
[class*="white"],
[class*="bg-white"] {
  background-color: #2c3d55 !important;
  background: #2c3d55 !important;
  color: #ffffff !important;
}

// 特别针对状态和类型列的修复
.el-table {
  // 强制覆盖所有表格单元格的白色背景
  td, th {
    &[style*="background-color: white"],
    &[style*="background-color: #fff"],
    &[style*="background-color: #ffffff"],
    &[style*="background: white"],
    &[style*="background: #fff"],
    &[style*="background: #ffffff"] {
      background-color: #2c3d55 !important;
      background: #2c3d55 !important;
      color: #ffffff !important;
    }
  }
  
  // 特别针对状态列
  .cell {
    // 状态标签和徽章
    .el-tag,
    .status-tag,
    .badge,
    .label {
      background-color: #364966 !important;
      color: #ffffff !important;
      border: 1px solid #5f6e8a !important;
      
      &.el-tag--success {
        background-color: rgba(103, 194, 58, 0.2) !important;
        color: #67c23a !important;
        border-color: #67c23a !important;
      }
      
      &.el-tag--warning {
        background-color: rgba(230, 162, 60, 0.2) !important;
        color: #e6a23c !important;
        border-color: #e6a23c !important;
      }
      
      &.el-tag--danger {
        background-color: rgba(245, 108, 108, 0.2) !important;
        color: #f56c6c !important;
        border-color: #f56c6c !important;
      }
      
      &.el-tag--info {
        background-color: rgba(165, 222, 241, 0.2) !important;
        color: #a5def1 !important;
        border-color: #a5def1 !important;
      }
    }
    
    // 状态文本
    .status-text {
      background-color: transparent !important;
      color: #ffffff !important;
      padding: 4px 8px !important;
      border-radius: 4px !important;
      font-weight: 500 !important;
      
      &.normal {
        background-color: rgba(103, 194, 58, 0.2) !important;
        color: #67c23a !important;
      }
      
      &.warning {
        background-color: rgba(230, 162, 60, 0.2) !important;
        color: #e6a23c !important;
      }
      
      &.error,
      &.danger {
        background-color: rgba(245, 108, 108, 0.2) !important;
        color: #f56c6c !important;
      }
      
      &.info {
        background-color: rgba(165, 222, 241, 0.2) !important;
        color: #a5def1 !important;
      }
    }
    
    // 类型文本
    .type-text {
      background-color: #364966 !important;
      color: #ffffff !important;
      padding: 4px 8px !important;
      border-radius: 4px !important;
      font-weight: 500 !important;
      border: 1px solid #5f6e8a !important;
    }
    
    // 强制覆盖所有可能的白色背景元素
    * {
      &[style*="background-color: white"],
      &[style*="background-color: #fff"],
      &[style*="background-color: #ffffff"],
      &[style*="background: white"],
      &[style*="background: #fff"],
      &[style*="background: #ffffff"] {
        background-color: #364966 !important;
        background: #364966 !important;
        color: #ffffff !important;
      }
    }
  }
}

// Element UI 标签组件强制修复
.el-tag {
  background-color: #364966 !important;
  color: #ffffff !important;
  border: 1px solid #5f6e8a !important;
  
  &--light {
    background-color: #364966 !important;
    color: #ffffff !important;
  }
  
  &--plain {
    background-color: transparent !important;
    color: #ffffff !important;
    border: 1px solid #5f6e8a !important;
  }
  
  &--success {
    background-color: rgba(103, 194, 58, 0.2) !important;
    color: #67c23a !important;
    border-color: #67c23a !important;
    
    &.el-tag--light {
      background-color: rgba(103, 194, 58, 0.1) !important;
      color: #67c23a !important;
    }
  }
  
  &--warning {
    background-color: rgba(230, 162, 60, 0.2) !important;
    color: #e6a23c !important;
    border-color: #e6a23c !important;
    
    &.el-tag--light {
      background-color: rgba(230, 162, 60, 0.1) !important;
      color: #e6a23c !important;
    }
  }
  
  &--danger {
    background-color: rgba(245, 108, 108, 0.2) !important;
    color: #f56c6c !important;
    border-color: #f56c6c !important;
    
    &.el-tag--light {
      background-color: rgba(245, 108, 108, 0.1) !important;
      color: #f56c6c !important;
    }
  }
  
  &--info {
    background-color: rgba(165, 222, 241, 0.2) !important;
    color: #a5def1 !important;
    border-color: #a5def1 !important;
    
    &.el-tag--light {
      background-color: rgba(165, 222, 241, 0.1) !important;
      color: #a5def1 !important;
    }
  }
  
  .el-tag__close {
    color: inherit !important;
    
    &:hover {
      background-color: rgba(255, 255, 255, 0.2) !important;
    }
  }
}

// 徽章组件修复
.el-badge {
  .el-badge__content {
    background-color: #f56c6c !important;
    color: #ffffff !important;
    border: 1px solid #f56c6c !important;
    
    &.is-fixed {
      background-color: #f56c6c !important;
    }
  }
}

// 进度条组件修复
.el-progress {
  .el-progress-bar__outer {
    background-color: #364966 !important;
    border: 1px solid #5f6e8a !important;
  }
  
  .el-progress-bar__inner {
    background-color: #3a7b99 !important;
  }
  
  .el-progress__text {
    color: #ffffff !important;
  }
}

// 步骤条组件修复
.el-steps {
  .el-step__icon {
    background-color: #364966 !important;
    border: 2px solid #5f6e8a !important;
    color: #ffffff !important;
    
    &.is-text {
      background-color: #364966 !important;
      color: #ffffff !important;
    }
  }
  
  .el-step.is-process .el-step__icon {
    background-color: #3a7b99 !important;
    border-color: #3a7b99 !important;
    color: #ffffff !important;
  }
  
  .el-step.is-finish .el-step__icon {
    background-color: #67c23a !important;
    border-color: #67c23a !important;
    color: #ffffff !important;
  }
  
  .el-step.is-error .el-step__icon {
    background-color: #f56c6c !important;
    border-color: #f56c6c !important;
    color: #ffffff !important;
  }
  
  .el-step__title {
    color: #ffffff !important;
    
    &.is-process {
      color: #3a7b99 !important;
    }
    
    &.is-finish {
      color: #67c23a !important;
    }
    
    &.is-error {
      color: #f56c6c !important;
    }
  }
  
  .el-step__description {
    color: rgba(255, 255, 255, 0.8) !important;
  }
}

// 时间线组件修复
.el-timeline {
  .el-timeline-item__node {
    background-color: #364966 !important;
    border: 2px solid #5f6e8a !important;
    
    &--normal {
      background-color: #364966 !important;
    }
    
    &--large {
      background-color: #364966 !important;
    }
  }
  
  .el-timeline-item__wrapper {
    color: #ffffff !important;
  }
  
  .el-timeline-item__title {
    color: #ffffff !important;
  }
  
  .el-timeline-item__content {
    color: rgba(255, 255, 255, 0.8) !important;
  }
  
  .el-timeline-item__timestamp {
    color: rgba(255, 255, 255, 0.6) !important;
  }
}

// 警告框组件修复
.el-alert {
  background-color: #364966 !important;
  border: 1px solid #5f6e8a !important;
  color: #ffffff !important;
  
  &--success {
    background-color: rgba(103, 194, 58, 0.1) !important;
    border-color: #67c23a !important;
    color: #67c23a !important;
    
    .el-alert__icon {
      color: #67c23a !important;
    }
  }
  
  &--warning {
    background-color: rgba(230, 162, 60, 0.1) !important;
    border-color: #e6a23c !important;
    color: #e6a23c !important;
    
    .el-alert__icon {
      color: #e6a23c !important;
    }
  }
  
  &--error {
    background-color: rgba(245, 108, 108, 0.1) !important;
    border-color: #f56c6c !important;
    color: #f56c6c !important;
    
    .el-alert__icon {
      color: #f56c6c !important;
    }
  }
  
  &--info {
    background-color: rgba(165, 222, 241, 0.1) !important;
    border-color: #a5def1 !important;
    color: #a5def1 !important;
    
    .el-alert__icon {
      color: #a5def1 !important;
    }
  }
  
  .el-alert__title {
    color: inherit !important;
  }
  
  .el-alert__description {
    color: inherit !important;
    opacity: 0.8;
  }
  
  .el-alert__closebtn {
    color: inherit !important;
    
    &:hover {
      background-color: rgba(255, 255, 255, 0.1) !important;
    }
  }
}

// 卡片组件强制修复
.el-card {
  background-color: #2c3d55 !important;
  border: 1px solid #5f6e8a !important;
  color: #ffffff !important;
  
  .el-card__header {
    background-color: #2a3950 !important;
    border-bottom: 1px solid #5f6e8a !important;
    color: #ffffff !important;
  }
  
  .el-card__body {
    background-color: #2c3d55 !important;
    color: #ffffff !important;
    
    // 强制覆盖卡片内的所有白色背景
    * {
      &[style*="background-color: white"],
      &[style*="background-color: #fff"],
      &[style*="background-color: #ffffff"],
      &[style*="background: white"],
      &[style*="background: #fff"],
      &[style*="background: #ffffff"] {
        background-color: #364966 !important;
        background: #364966 !important;
        color: #ffffff !important;
      }
    }
  }
}

// 面板组件修复
.el-collapse {
  background-color: #2c3d55 !important;
  border: 1px solid #5f6e8a !important;
  
  .el-collapse-item {
    background-color: #2c3d55 !important;
    
    .el-collapse-item__header {
      background-color: #2a3950 !important;
      color: #ffffff !important;
      border-bottom: 1px solid #5f6e8a !important;
      
      &:hover {
        background-color: #222e41 !important;
      }
    }
    
    .el-collapse-item__content {
      background-color: #2c3d55 !important;
      color: #ffffff !important;
      border-bottom: 1px solid #5f6e8a !important;
    }
  }
}

// 强制覆盖所有可能的内联样式
[style*="background-color: white"] {
  background-color: #2c3d55 !important;
  color: #ffffff !important;
}

[style*="background-color: #fff"] {
  background-color: #2c3d55 !important;
  color: #ffffff !important;
}

[style*="background-color: #ffffff"] {
  background-color: #2c3d55 !important;
  color: #ffffff !important;
}

[style*="background: white"] {
  background-color: #2c3d55 !important;
  color: #ffffff !important;
}

[style*="background: #fff"] {
  background-color: #2c3d55 !important;
  color: #ffffff !important;
}

[style*="background: #ffffff"] {
  background-color: #2c3d55 !important;
  color: #ffffff !important;
}

// 强制覆盖所有白色文字
[style*="color: white"],
[style*="color: #fff"],
[style*="color: #ffffff"] {
  color: #ffffff !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) !important;
}

// 特殊处理：确保在深色背景上的白色文字可见
.dark-bg,
.theme-dark {
  [style*="color: white"],
  [style*="color: #fff"],
  [style*="color: #ffffff"] {
    color: #ffffff !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5) !important;
  }
}

